<!--
  Generated template for the TodoPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>
  <ion-navbar>
    <ion-icon name="contact" style="font-size:2em;color: #FFF;margin-left:0.8rem;margin-top:0.3rem;"></ion-icon>
    <span class="title-user">{{user.userName}}</span>
    <ion-buttons end>
      <button ion-button clear small (click)="toDonePage()">
        <span class="right-button">已办列表</span>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>
<ion-content>
  <div class="search-bar-content">
    <ion-searchbar placeholder="搜索" (ionInput)="searchWork()" [(ngModel)]="workInput">
    </ion-searchbar>
  </div>
  <!--下拉事件时，刷新页面数据-->
  <ion-refresher (ionRefresh)="worklist.doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉刷新" refreshingSpinner="circles" refreshingText="刷新中...">
    </ion-refresher-content>
  </ion-refresher>
  <ion-list class="bhq-list">
    <ion-item class="bhq-item" (click)="toQueryWork(item)" *ngFor="let item of worklist.datas">
      <ion-thumbnail item-start>
        <img src="assets/imgs/{{item.prjforname}}.png">
      </ion-thumbnail>
      <h2 class="bhq-item-title-black" *ngIf="item.sread=='1'">{{item.sbusiness | asLength:12}}</h2>
      <h2 class="bhq-item-title-red" *ngIf="item.sread == '0' || item.sread==null || item.sread==''">{{item.sbusiness | asLength:12}}</h2>
      <div class="bhq-item-content">
        <div class="bhq-item-info">
          <p>[{{item.actdefname}}] {{item.taskdefname}}</p>
          <p>{{item.fromtime | asDate}} {{item.fromtime | asTime}}</p>
        </div>
      </div>
    </ion-item>
  </ion-list>
  <!-- 无级滚动效果实现 -->
  <ion-infinite-scroll (ionInfinite)="worklist.doInfinite($event)">
    <ion-infinite-scroll-content></ion-infinite-scroll-content>
  </ion-infinite-scroll>
</ion-content>